<template>
	<div>
		<div class="bgfff">
			<div style="display: flex;justify-content: space-between;">
				<div style="padding: 60px 0 0 112px ;">
					<div class="displayFlex">
						<div style="width: 72px;line-height: 48px;background: #3248B7;border-radius: 4px;"
							class="textCenter colorfff font14 mr20">{{carDet.carCodeColor}}</div>
						<div>
							<div class="color333 font24">{{carDet.vehicleNo}}</div>
							<div class="color333 font16 mt5">{{carDet.carType}}</div>
						</div>
					</div>
					<div style="margin-top: 60px;" class="displayFlex">
						<div style="margin-right: 48px;">
							<span class="font16" style="color: #757575;">车辆颜色</span>
							<span class="color333 font16 ml15">{{carDet.carCodeColor}}</span>
						</div>
						<div style="margin-right: 48px;">
							<span class="font16" style="color: #757575;">排放标准</span>
							<span class="color333 font16 ml15">{{carDet.carStdStr}}</span>
						</div>
						<div style="margin-right: 48px;">
							<span class="font16" style="color: #757575;">燃料类型</span>
							<span class="color333 font16 ml15">{{carDet.fuelTypeStr}}</span>
						</div>
						<div>
							<span class="font16" style="color: #757575;">车辆型号</span>
							<span class="color333 font16 ml15">{{carDet.carModel || '--'}}</span>
						</div>
					</div>

					<div style="margin-top: 60px;" class="displayFlex">
						<div style="margin-right: 48px;">
							<span class="font16" style="color: #757575;">{{carDet.licenseDate.substring(0,10)}}注册登记</span>
						</div>
					</div>

					<div style="margin-top: 30px;" class="color333 font24">所属人或单位</div>
					<div style="margin-top: 30px;" class="color333 font24">使用性质(编辑状态)</div>

				</div>

				<div style="padding: 20px 20px 0 0;">
					<el-image style="width: 460px;height: 324px;" :src="carDet.carImg" :preview-src-list="[carDet.carImg]"></el-image>
				</div>
			</div>

			<div style="height: 1px;background: #EDEDED;border-radius: 1px;margin-top: 67px;margin-bottom: 34px;"></div>

			<div class="displayFlex" style="padding: 0 0 30px 112px;">
				<div style="margin-right: 56px;">
					<span class="font16" style="color: #757575;">车辆识别代码</span>
					<span class="color333 font16 ml15">{{carDet.carVin || '--'}}</span>
				</div>
				<div style="margin-right: 56px;">
					<span class="font16" style="color: #757575;">发动机型号</span>
					<span class="color333 font16 ml15">{{carDet.engineModel || '--'}}</span>
				</div>
				<div style="margin-right: 56px;">
					<span class="font16" style="color: #757575;">发动机生产厂</span>
					<span class="color333 font16 ml15">{{carDet.engineEnt || ''}}</span>
				</div>
				<div style="margin-right: 56px;">
					<span class="font16" style="color: #757575;">发动机编号</span>
					<span class="color333 font16 ml15">{{carDet.engineNo || '--'}}</span>
				</div>
				<div>
					<span class="font16" style="color: #757575;">联网状态</span>
					<span class="color333 font16 ml15">{{carDet.netStatusStr || '--'}}</span>
				</div>
			</div>
		</div>

		<div class="displayFlexBet mt20">
			<div style="flex:2" class="mr20">
				<el-image style="width: 100%;height: 628px;" :src="carDet.listImg" :preview-src-list="[carDet.listImg]"></el-image>
				<div>随车清单</div>
			</div>
			<div style="flex: 3;">
				<el-image style="width: 100%;height: 628px;" :src="carDet.drivingLicenseImg" :preview-src-list="[carDet.drivingLicenseImg]"></el-image>
				<div>行驶证</div>
			</div>
		</div>

	</div>
</template>

<script>
	let that
	export default {
		name: 'VehicleInfo',
		data: function() {
			return {
				carDet: {}
			};
		},
		mounted() {
			that = this
			that.ajax({
				url: 'cleanTransportation/getCarDetById?ticketId=' + that.$store.state.token,
				data: {
					id: that.$route.query.id
				},
				contentType: 'application/x-www-form-urlencoded',
				success: function(result) {
					that.carDet = result.data
				},
			})
		},
		methods: {},
	};
</script>

<style scoped>

</style>